import 'dart:html';

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:my_flutter_test/pages/homePage.dart';
import 'package:my_flutter_test/reqs/requests.dart';

class ItemPage extends StatefulWidget {
  const ItemPage({super.key, required this.itemId});

  @override
  State<StatefulWidget> createState() => ItemPageState();
  final int itemId;
}

class ItemPageState extends State<ItemPage> {
  late TextEditingController commentController;

  @override
  void initState() {
    super.initState();
    commentController = TextEditingController();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("物品详情"),
      ),
      body: FutureBuilder(
          future: mockItemInfo(widget.itemId),
          builder: (context, snapshot) {
            if (snapshot.connectionState == ConnectionState.done) {
              if (snapshot.hasError) {
                return const Icon(Icons.error);
              } else {
                return Container(
                  padding: const EdgeInsets.all(24),
                  child: Column(
                    children: [
                      Row(
                        children: [
                          //Image.memory(snapshot.data!.img),
                          Text(snapshot.data!.name),
                          Text(snapshot.data!.price),
                          Text(snapshot.data!.description)
                        ],
                      ),
                      Row(
                        children: [
                          ElevatedButton(
                              onPressed: () {}, child: const Text("联系卖家")),
                          Text(snapshot.data!.ownerName)
                        ],
                      ),
                      Card(
                          elevation: 0,
                          color: Theme.of(context).colorScheme.surfaceVariant,
                          child: Column(
                            children: [
                              TextField(
                                controller: commentController,
                                decoration: const InputDecoration(
                                  border: OutlineInputBorder(),
                                  labelText: "输入评论",
                                ),
                              ),
                              ElevatedButton(
                                  onPressed: () {}, child: const Text("发布评论"))
                            ],
                          )),
                      /*ListView.builder(
                          itemCount: snapshot.data!.comments.length,
                          itemBuilder: (context, index) {
                            return Comment(
                                userAvatar: Image.memory(
                                    snapshot.data!.comments[index].userImg),
                                userName: snapshot.data!.comments[index].userName,
                                comment: snapshot.data!.comments[index].content);
                          })*/
                    ],
                  ),
                );
              }
            } else {
              // 请求未结束，显示loading
              return const CircularProgressIndicator();
            }
          }),
    );
  }
}

class Comment extends StatelessWidget {
  const Comment(
      {super.key,
      required this.userAvatar,
      required this.userName,
      required this.comment});

  final Image userAvatar;
  final String userName;
  final String comment;

  @override
  Widget build(BuildContext context) {
    return Card(
        elevation: 0,
        color: Theme.of(context).colorScheme.surfaceVariant,
        child: Column(
          children: [
            Container(
              child: Row(
                children: [
                  CircleAvatar(
                    child: userAvatar,
                  ),
                  Text(userName)
                ],
              ),
            ),
            Text(comment)
          ],
        ));
  }
}
